1import Box from '@mui/material/Box';
  2import Container from '@mui/material/Container';
  3import {useTheme} from '@mui/material/styles';
  4import {PropsWithChildren} from 'react';
  5import pageUtils from '../../../lib/pageUtils';
  6import useEventStore from '../../../stores/useEventStore';
  7import EventLayout, {TabComponent} from '../../../layouts/Event';
  8import {
  9  EventByUuidDocument,
 10  Module,
 11  ModuleDocument,
 12  Enum_Userspermissionsuser_Lang as SupportedLocales,
 13} from '../../../generated/graphql';
 14import CarosterPlusOption from '../../../containers/CarosterPlusOption';
 15import CarosterPlusSettings from '../../../containers/CarosterPlusSettings';
 16import {Typography} from '@mui/material';
 17import {useTranslation} from 'next-i18next';
 18import {getLocaleForLang} from '../../../lib/getLocale';
 19
 20interface Props {
 21  modulesSettings?: Module;
 22  eventUUID: string;
 23  announcement?: string;
 24}
 25
 26const Page = (props: PropsWithChildren<Props>) => {
 27  return <EventLayout {...props} Tab={OptionsTab} />;
 28};
 29
 30const OptionsTab: TabComponent<Props> = ({modulesSettings}) => {
 31  const {t} = useTranslation();
 32  const theme = useTheme();
 33  const event = useEventStore(s => s.event);
 34
 35  if (!event) return null;
 36
 37  const carosterPlusActivated =
 38    modulesSettings?.caroster_plus_enabled &&
 39    event.enabled_modules?.includes('caroster-plus');
 40
 41  return (
 42    <Box position="relative">
 43      <Container
 44        sx={{
 45          p: 4,
 46          mt: 6,
 47          mb: 11,
 48          mx: 0,
 49          [theme.breakpoints.down('md')]: {
 50            p: 2,
 51            mt: 13,
 52          },
 53        }}
 54      >
 55        {carosterPlusActivated && <CarosterPlusSettings event={event} />}{' '}
 56        {modulesSettings?.caroster_plus_enabled && !carosterPlusActivated && (
 57          <CarosterPlusOption event={event} modulesSettings={modulesSettings} />
 58        )}
 59        {!modulesSettings?.caroster_plus_enabled && (
 60          <Typography variant="overline">{t`options.no_module`}</Typography>
 61        )}
 62      </Container>
 63    </Box>
 64  );
 65};
 66
 67export const getServerSideProps = pageUtils.getServerSideProps(
 68  async (context, apolloClient) => {
 69    const {uuid} = context.query;
 70    const {host = ''} = context.req.headers;
 71    let event = null;
 72    let modulesSettings = null;
 73
 74    // Fetch event
 75    try {
 76      const {data} = await apolloClient.query({
 77        query: EventByUuidDocument,
 78        variables: {uuid},
 79      });
 80      event = data?.eventByUUID?.data;
 81    } catch (error) {
 82      return {
 83        notFound: true,
 84      };
 85    }
 86
 87    // Fetch modules settings
 88    try {
 89      const {data} = await apolloClient.query({
 90        query: ModuleDocument,
 91        variables: {locale: context.locale},
 92      });
 93      modulesSettings = data?.module?.data?.attributes || {};
 94
 95      const {caroster_plus_description, caroster_plus_name} = modulesSettings;
 96
 97      if (
 98        caroster_plus_description &&
 99        caroster_plus_name &&
100        String(caroster_plus_description).length === 0 &&
101        String(caroster_plus_name).length === 0
102      ) {
103        console.warn(
104          'Module settings are not set for locale: ',
105          context.locale,
106          ' fallback to English'
107        );
108        const {data: enData} = await apolloClient.query({
109          query: ModuleDocument,
110          variables: {locale: SupportedLocales['en']},
111        });
112        modulesSettings = enData?.module?.data?.attributes;
113      }
114    } catch (error) {
115      console.error(error);
116    }
117
118    const description = await getLocaleForLang(
119      event?.attributes?.lang,
120      'meta.description'
121    );
122
123    return {
124      props: {
125        modulesSettings,
126        eventUUID: uuid,
127        metas: {
128          title: event?.attributes?.name || '',
129          description,
130          url: `https://${host}${context.resolvedUrl}`,
131        },
132      },
133    };
134  }
135);
136export default Page;